<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>01_作用域</title>
</head>
<body>
<!--
1. 理解
  * 就是一块"地盘", 一个代码段所在的区域
  * 它是静态的(相对于上下文对象), 在编写代码时就确定了
2. 分类
  * 全局作用域
  * 函数作用域
  * 没有块作用域(ES6有了)
3. 作用
  * 隔离变量，不同作用域下同名变量不会有冲突
-->
<script type="text/javascript">
/*  //没块作用域
  if(true) {
    var c = 3
  }
  console.log(c)*/

  var a = 10,
    b = 20
  function fn(x) {
    var a = 100,
      c = 300;
    console.log('fn()', a, b, c, x)  // 100 20 300 10
    function bar(x) {
      var a = 1000,
        d = 400
      console.log('bar()', a, b, c, d, x)
    }

    bar(100)  //1000 20 undefined 400 100  错了
    bar(200)  //1000 20 undefined 400 200   错了
    //  上面唯一做错的是c，我认为就是bar里面找不到，就去全局中找，也找不到，所以c就是undefined
    //  这个逻辑没有错，他的确没有去外层函数fn中找c，但是为什么能够找到呢？这个地方是因为闭包
    //  嵌套函数，内部好书引用外部函数的时候会产生闭包，这个地方的c就是从闭包里面找的
  }
  fn(10)
</script>
</body>
</html>